<template >
	<view>
		<view class="logo">
			<image  src="/static/icon/login.png" class="img"></image>
		</view>
		<view class="login">
			<view class="pan">
				<h2 class="h">登录</h2>
				
				<input type="text" placeholder="邮箱" class="text1" v-model="email"/>
				<input type="password" placeholder="密码" class="text2" v-model="password" />
				
				<navigator url="/pages/login/ForgetPwd" class="navigator">忘记密码?</navigator>
				<button type="primary" class="button" @click="toLogin">登录</button>
				<h5 class="h5">没有账号?</h5>
				<navigator url="/pages/login/Registration-page" class="navigator1">点我注册</navigator>
			</view>
		</view>
	</view>
</template>



<script>
	
	export default {
		data() {
			return {
				email:'',
				password:''
			}
		},
		methods: {
			// 提交表单
			toLogin:function(){
				// if(this.email === "admin" && this.password === "123456"){
				// 	// uni.navigateBack();
				// 	uni.switchTab({
				// 		// url: '../MainMenu/detail/detail?title=' + "22"
				// 		url: '../MainMenu/all'
				// 	});
					
				// }
				uni.request({
					url:'http://ddns.sunnfuture.cn:8888/login',
					method:'POST',
					// dataType:'JSON',
					header:{'content-type': 'application/x-www-form-urlencoded'},
					data:{
						"username":this.email,
						"password":this.password
					},
					success: res => {
						console.log(res.data.code);
						if(res.data.code === 20000)
						{
							
							uni.switchTab({
							// url: '../MainMenu/detail/detail?title=' + "22"
							url: '/pages/MainMenu/MainMenu'
							});
						}
						else{
							uni.showToast({
								title:"用户名或者密码输入错误",
							})
						}

					},
					fail: err => {
						console.log("err");
					}
				})
			}
		},
		
	}
</script>


<style>	
 page {
	background-color: rgb(234,239,255)
}
.logo {
	display: flex;
	justify-content:center;	
}
.img{
	margin-top: 40rpx;
	margin-left: 0rpx;
	width: 175rpx;
	height: 145rpx;
	mix-blend-mode: normal;
}
.login{
	display: flex;
	justify-content: center;
	align-items: center;
}
.pan{
	margin-top: 70rpx;
	width: 600rpx;
	height: 800rpx;
	background: rgba(255, 255, 255, 1);
	background-blend-mode: normal;
	border-radius: 24rpx;
	mix-blend-mode: normal;	
}
.button{
	width: 70%;
	left: 0rpx;
	margin-top: 85rpx;
	font-size: 40rpx;
    border-radius: 24rpx;
}
.text1{
	  -webkit-appearance: none;
	    background: rgba(231, 235, 246, 1);
 	    -webkit-box-sizing: border-box; 
	    box-sizing: border-box;
	    display: inline-block;
	    font-size: inherit;
	    line-height: 40px;
	    outline: 0;
	    padding: 0 15px;
	    -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
	    transition: border-color .2s cubic-bezier(.645,.045,.355,1);
	    width: 70%;
		height: 96rpx;
		margin-left: 80rpx;
		margin-top: 70rpx;
		border-radius: 20rpx;
		background-blend-mode: normal;
		mix-blend-mode: normal;
}
.text2{
	-webkit-appearance: none;
	  background: rgba(231, 235, 246, 1);
	  -webkit-box-sizing: border-box; 
	  box-sizing: border-box;
	  display: inline-block;
	  font-size: inherit;
	  line-height: 40px;
	  outline: 0;
	  padding: 0 15px;
	  -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
	  transition: border-color .2s cubic-bezier(.645,.045,.355,1);
	  width: 70%;
      height: 96rpx;
      margin-left: 80rpx;
      margin-top: 10rpx;
      border-radius: 20rpx;
      background-blend-mode: normal;
      mix-blend-mode: normal;
}
.h{
	margin-left: 50rpx;
	margin-top:50rpx;
	font-size: 60rpx;
}
.h5{
	margin-left: 245rpx;
	margin-top:50rpx;
	font-weight: 900;
}
.navigator{
	margin-left: 80rpx;
	margin-top: 20rpx;
	width: 149rpx;
	height: 20rpx;
	mix-blend-mode: normal;
	color: rgba(0, 122, 255, 1);
	font-size: 30rpx;
	font-weight: 900;
	line-height: 30rpx;
}
.navigator1{
	margin-left: 250rpx;
	margin-top: 20rpx;
	width: 149rpx;
	height: 20rpx;
	mix-blend-mode: normal;
	color: rgba(0, 122, 255, 1);
	font-size: 20rpx;
	font-weight: 900;
	line-height: 30rpx;
}
</style>
